﻿﻿<div class="form-group">
    <label data-bind="text: key" class="col-sm-3 control-label"></label>
    <div class="col-sm-9">
        <div class="input-groups">
            <!-- ko foreach: value -->
            <div class="input-group" data-bind="attr: {'data-id': $index}">
                <input data-bind="value: key" type="text" class="form-control key" placeholder="Key">
                <span class="input-group-addon">-</span>
                <input data-bind="value: value" type="text" class="form-control value" placeholder="Value">
                <span class="input-group-btn"><a data-bind="click: $parent.remove, tooltip: Kooboo.text.common.remove" class="btn btn-default" href="#" ><i class="fa fa-minus"></i></a></span>
            </div>
            <!-- /ko -->
            <a data-bind="click: add, tooltip: Kooboo.text.common.add" class="btn btn-default" href="#"><i class="fa fa-plus"></i></a>
        </div>
    </div>
</div>